<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Регистрация пользователя</title>
</head>
<body>

<form id="registrationForm">
    <h1 id="succes"></h1>
    <input type="text" id="firstName" placeholder="Имя" required>
    <input type="text" id="lastName" placeholder="Фамилия" required>
    <input type="email" id="email" placeholder="Email" required>
    <input type="password" id="password" placeholder="Пароль" required>
    <button type="submit">Зарегистрироваться</button>
</form>

<script>
const form = document.getElementById('registrationForm');

form.addEventListener('submit', function(event) {
    event.preventDefault();

    const firstName = document.getElementById('firstName').value;
    const lastName = document.getElementById('lastName').value;
    const email = document.getElementById('email').value;
    const password = document.getElementById('password').value;

    const data = JSON.stringify({
        firstName: firstName,
        lastName: lastName,
        email: email,
        password: password
    });

    const params = {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: data
    };

    fetch('/registration', params)
        .then(response => {
            if (response.status === 201) {
                document.getElementById("succes").innerText = `Успешная регистрация!`;
                return response.json();
            } else {
                document.getElementById("succes").innerText = `Ошибка при регистрации`;
            }
        })
        .catch((error) => console.error('Ошибка:', error));
});


</script>

</body>
</html>